import React from 'react'
import Image from 'next/image'
import logo from '@/public/img/logo.png'
import Link from 'next/link'
import { FaPinterestP, FaXTwitter, FaFacebookF, FaTiktok  } from "react-icons/fa6";
const Footer = () => {
  return (
    <footer>
      <div className='bg-white py-8 md:py-16'>
        <div className='w w-container'>
          <div className='flex flex-wrap gap-y-8 grid-cols-12 justify-between'>
            <div className='space-y-8 w-full md:w-fit'>
              <div className='flex justify-center md:justify-start'>
                <Image className='h-[80px] w-auto' src={logo} alt='logo' />
              </div>
              <div className='space-y-4 text-center md:text-left'>
                <p>提供全球最新、最全面的汽车资讯，<br /> 让您随时随地了解汽车动态。</p>
                <ul className='flex gap-4 justify-center md:justify-start'>
                  <li>
                    <Link className='bg-[#E60023] rounded-lg w-[40px] h-[40px] flex items-center justify-center' href={'/'}>
                      <FaPinterestP className='w-[24px] h-[24px] text-white' />
                    </Link>
                  </li>
                  <li>
                    <Link className='bg-[#000000] rounded-lg w-[40px] h-[40px] flex items-center justify-center' href={'/'}>
                      <FaXTwitter className='w-[24px] h-[24px] text-white' />
                    </Link>
                  </li>
                  <li>
                    <Link className='bg-[#1877F2] rounded-lg w-[40px] h-[40px] flex items-center justify-center' href={'/'}>
                      <FaFacebookF className='w-[24px] h-[24px] text-white' />
                    </Link>
                  </li>
                  <li>
                    <Link className='bg-[#000000] rounded-lg w-[40px] h-[40px] flex items-center justify-center' href={'/'}>
                      <FaTiktok  className='w-[24px] h-[24px] text-white' />
                    </Link>
                  </li>
                </ul>
              </div>
            </div>
            <ul className='flex flex-col gap-1'>
              <h3 className='mb-2'>关于我们</h3>
              <li>
                <Link className='link' href='/'>公司简介</Link>
              </li>
              <li>
                <Link className='link' href='/'>公司文化</Link>
              </li>
              <li>
                <Link className='link' href='/'>公司愿景</Link>
              </li>
            </ul>
            <ul className='flex flex-col gap-1'>
              <h3 className='mb-2'>帮助中心</h3>
              <li>
                <Link className='link' href='/'>常见问题</Link>
              </li>
              <li>
                <Link className='link' href='/'>联系我们</Link>
              </li>
              <li>
                <Link className='link' href='/'>加入我们</Link>
              </li>
              <li>
                <Link className='link' href='/'>帮助中心</Link>
              </li>
              <li>
                <Link className='link' href='/'>隐私政策</Link>
              </li>
            </ul>
            <ul className='flex flex-col gap-1'>
              <h3 className='mb-2'>联系我们</h3>
              <li>
                <Link className='link' href='/'>电话</Link>
              </li>
              <li>
                <Link className='link' href='/'>邮箱</Link>
              </li>
              <li>
                <Link className='link' href='/'>地址</Link>
              </li>
            </ul>
            <ul className='flex flex-col gap-1'>
              <h3 className='mb-2'>法律信息</h3>
              <li>
                <Link className='link' href='/'>隐私政策</Link>
              </li>
              <li>
                <Link className='link' href='/'>服务条款</Link>
              </li>
              <li>
                <Link className='link' href='/'>版权声明</Link>
              </li>
              <li>
                <Link className='link' href='/'>法律声明</Link>
              </li>
              <li>
                <Link className='link' href='/'>知识产权</Link>
              </li>
            </ul>
          </div>
        </div>
      </div>
      <p className='text-center text-sm py-4'>Copyright © 2025 AutoWeb. All rights reserved.</p>
    </footer>
  )
}

export default Footer